 <!DOCTYPE html>
<html lang="zh-cmn-Hans">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="BI system demo">
    <meta name="author" content="Louis">
    
    <script src="http://img.foshanplus.com/js/jquery.js"></script>
    <!-- Echart -->
    <!-- <script type="text/javascript" src="http://img.foshanplus.com/js/echarts.min.js" charset="utf-8"></script> -->

    <script type="text/javascript" src="http://img.foshanplus.com/js/wordcloud2.js"></script>

    <title>佛山新闻热词</title>

    <style type="text/css">
        body,
        html {
            width: 100%;
            height: 100%;
            margin: 0;
            font-family: "微软雅黑";
        }

    </style>

</head>

<body style="background-color:transparent;">
<!-- <body> -->
    <div id="canvas-container" style="float: left">
        <canvas id="canvas" width="800px" height="600px"></canvas>
    </div>


<script type="text/javascript">
$(document).ready(function(){
    var wordFreqs = [{Key: "企业",Value: 60},
        {Key: "文化",Value: 50},
        {Key: "博物馆",Value: 46},
        {Key: "市民",Value: 45},
        {Key: "城市",Value: 28},
        {Key: "服务",Value: 22},
        {Key: "群众",Value: 21},
        {Key: "环境",Value: 19},
        {Key: "提升",Value: 19},
        {Key: "http",Value: 18}]
    var wordFreqData = new Array();
    for (var i = 0; i < wordFreqs.length; i++) {
        var option = [wordFreqs[i].Key, wordFreqs[i].Value];
        wordFreqData.push(option);
    }
    var canvas = document.getElementById('canvas');
    var options = eval({
            "list": wordFreqData,//或者[['各位观众',45],['词云', 21],['来啦!!!',13]],只要格式满足这样都可以
            "gridSize": 12, // 密集程度 数字越小越密集
            "weightFactor": 2, // 字体大小=原始大小*weightFactor
            "maxFontSize": 13, //最大字号
            "minFontSize": 5, //最小字号
            "fontWeight": 'normal', //字体粗细
            "fontFamily": 'Times, serif', // 字体
            "color": 'random-light', // 字体颜色 'random-dark' 或者 'random-light'
            "backgroundColor": 'rgba(255,255,255,1)', // 背景颜色
            "rotateRatio": 0 // 字体倾斜(旋转)概率，1代表总是倾斜(旋转)
        });
    //生成
    WordCloud(canvas, options);
})


</script>

</body>
